<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<div th:replace="gm/common :: html"></div>
	<table class="easyui-datagrid" title="GM账号列表" id="GMAccountPanel"
		style="width: 95%; height: 600px;"
		data-options="singleSelect:true,pagination:true,collapsible:true,url:'/account/getAccount',method:'get',toolbar:toolbar">
		<thead>
			<tr>
				<th data-options="field:'id',width:230,align:'center'" hidden="true">ID</th>
				<th data-options="field:'username',width:230,align:'center'">账号</th>
				<th data-options="field:'password',width:160,align:'center'">密码</th>
				<th data-options="field:'role',width:160,align:'center'">所属角色</th>
				<th data-options="field:'createTime',width:240,align:'center'">创建时间</th>
				<th data-options="field:'creator',width:170,align:'center'">创建者</th>
			</tr>
		</thead>
	</table>

	<div id="addUserDlg" class="easyui-dialog" title="添加账号"
		data-options="iconCls:'icon-save',resizable:true,modal:true,closed:true"
		style="width: 600px; height: 300px; padding: 20px">
		<div align="center" style="margin-top: 30px;">
			<table style="border-collapse: separate; border-spacing: 0px 10px;">
				<tr>
					<td>账号:</td>
					<td><input class="easyui-textbox" type="text" name="username"
						id="username" data-options="required:true"></input></td>
				</tr>
				<tr>
					<td>密码:</td>
					<td><input class="easyui-textbox" type="text" name="password1"
						id="password1" data-options="required:true"></input></td>
				</tr>
				<tr>
					<td>密码</td>
					<td><input class="easyui-textbox" type="text" id="password2"
						name="password2" data-options="required:true"></input></td>
				</tr>
			</table>
			<button id="SubmitAddAccount" type="button" class="btn btn-primary"
				value="提交">提交</button>
		</div>
	</div>
	
	<div id="changeRoleDlg" class="easyui-dialog" title="修改角色"
		data-options="iconCls:'icon-edit',resizable:true,modal:true,closed:true"
		style="width: 600px; height: 300px;">
		<div align="center" style="padding-top: 30px;">
			<table style="border-collapse: separate; border-spacing: 0px 10px;">
				<tr>
					
					<td>
					<input type = "hidden" value="" id="userId"/>
					账号名称:<input class="easyui-textbox" type="text" name="changeRole_username"
						id="changeRole_username" data-options="required:true,editable:false" style="width: 80%;"></input></td>
				</tr>
				<tr>
					
					<td>
					  选择角色: <input id="roleId" class="easyui-combobox"
						name="language" style="width: 80%;"
						data-options="
                    url:'/gm-role/getRoleList',
                    method:'get',
                    valueField:'id',
                    textField:'text',
                    panelHeight:'auto',
                    labelPosition: 'top'
                   
                    ">
					</td>
				</tr>
				
			</table>
			<button id="SubmitChangeRole" type="button" class="easyui-linkbutton"
				value="提交">--提交--</button>
		</div>
	</div>
	
	<script type="text/javascript">
		var toolbar = [ {
			text : '添加用户',
			iconCls : 'icon-add',
			handler : function() {
				$("#addUserDlg").dialog("open");
			}
		}, {
			text : '删除用户',
			iconCls : 'icon-remove',
			handler : deleteAccount
		},{
			text : '修改角色',
			iconCls : 'icon-edit',
			handler : changeRole
		} ];
		function changeRole(){
			var row = $("#GMAccountPanel").datagrid("getSelected");
			if(row == null){
				$.messager.alert('提示', '请选择需要编辑的用户', 'error');
				return;
			}
			$("#changeRole_username").textbox("setValue",row.username);
			$("#changeRoleDlg").dialog("open");
		}
		function deleteAccount() {
			var row = $("#GMAccountPanel").datagrid("getSelected");
			$.messager.confirm('警告', '确定要删除'+ row.username +'用户吗？', function(r) {
				if (r) {
					
					var id = row.id;
					var url = "/account/deleteAccount/" + id;
					postAjax(url, {}, function(data) {
						if (data.code == 0) {
							$("#GMAccountPanel").datagrid("reload");
						} else {
							$("#errorTips").html(data.msg);
						}
					});
				}
			});
		}
		$(document).ready(function() {
			$("#SubmitAddAccount").click(function() {
				var username = $("#username").val();
				var password1 = $("#password1").val();
				var password2 = $("#password2").val();
				var json = {
					"username" : username,
					"password1" : password1,
					"password2" : password2
				};
				var url = "/account/addAccount";
				postAjax(url, json, function(data) {
					if (data.code == 0) {
						$("#GMAccountPanel").datagrid("reload");
						$("#addUserDlg").dialog("close");
						$.messager.alert('提示', '添加用户成功');
					} else {
						$("#errorTips").html(data.msg);
					}
				});
			});
			$("#SubmitChangeRole").click(function(){
				var row = $("#GMAccountPanel").datagrid("getSelected");
				if(row == null){
					$.messager.alert('提示', '请选择需要编辑的用户', 'error');
					return;
				}
				var userId = row.id;
				var roleId = $("#roleId").combobox("getValue");
				var json = {"userId":userId,"roleId":roleId};
				var url = "/account/updateAccountRole";
				postAjax(url, json, function(data) {
					if (data.code == 0) {
						$("#GMAccountPanel").datagrid("reload");
						$("#changeRoleDlg").dialog("close");
						$.messager.alert('提示', '修改角色成功');
					} else {
						$("#errorTips").html(data.msg);
					}
				});
			});
		});
	</script>
</body>
</html>